<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:replace="./widget/base"></div>
</head>
<body>

<div id="roleToolbar">
    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/ROLE_ADD_DIALOG'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-plus" plain="true"
       onclick="roleAddDialog();">新增</a>

    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/ROLE_EDIT_DIALOG'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-edit" plain="true"
       onclick="roleEditDialog();">编辑</a>

    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/ROLE_DELETE_ALL'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-close" plain="true"
       onclick="roleDeleteAll();">删除</a>

    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/VIEW_MENU_DIALOG'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-edit" plain="true"
       onclick="viewMenuDialog();">视图菜单管理</a>

    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/ROLE_AUTHORITY_VIEW_PAGE_DIALOG'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-edit" plain="true"
       onclick="roleAuthorityViewPageDialog();">视图页面权限管理</a>

    <a th:if="${#authorization.expression('hasRole('''+ SYSTEM_ADMIN +''') OR hasAuthority(''/COMPONENT/USER/ROLE/PAGE_ALL/ROLE_AUTHORITY_API_DIALOG'')')}"
       href="javascript:" class="easyui-linkbutton" iconCls="fa fa-edit" plain="true"
       onclick="roleAuthorityApiDialog();">API 权限管理</a>
</div>
<table id="role"></table>

<script type="text/javascript">
    $(function () {
        var columns = [
            {field: 'checkbox', checkbox: true},
            {field: 'id', title: 'ID'},
            {field: 'name', title: '角色名称'},
            {field: 'value', title: '角色值'},
            {field: 'remark', title: '备注'},
            {field: 'gmtModified', title: '更新时间'},
            {field: 'gmtCreated', title: '创建时间'}
        ];
        $('#role').datagrid(expressui.grid.create, {
            title: '用户角色',
            columns: [columns],
            url: Api.User.ROLE + '/page_all'
        });
    });

    function roleAddDialog() {
        $('#roleAddDialog').dialog(expressui.dialog.create, {
            title: '新增用户角色',
            grid: {type: 'datagrid', selector: '#role'},
            href: Page.User.ROLE + '/add_dialog',
            save: {
                url: Api.User.ROLE + '/add_one',
                method: 'post'
            },
            buttons: [{
                text: '保存',
                iconCls: 'fa fa-save',
                handler: expressui.dialog.add,
                reload: [{type: 'datagrid', selector: '#role'}],
                success: '新增成功'
            }, {
                text: '关闭',
                iconCls: 'fa fa-close',
                handler: expressui.dialog.close
            }]
        });
    }

    function roleEditDialog() {
        var one = $('#role').datagrid(expressui.grid.getCheckedOneShowAlert);
        if (one) {
            $('#roleDialog').dialog(expressui.dialog.create, {
                title: '编辑用户角色',
                grid: {type: 'datagrid', selector: '#role'},
                selector: '#roleEditDialog',
                href: Page.User.ROLE + '/edit_dialog',
                get: {url: Api.User.ROLE + '/one/{id}', method: 'get'},
                save: {url: Api.User.ROLE + '/save_one', method: 'post'},
                buttons: [{
                    text: '保存',
                    iconCls: 'fa fa-save',
                    handler: expressui.dialog.save,
                    reload: [{type: 'datagrid', selector: '#role'}],
                    success: '保存成功'
                }, {
                    text: '关闭',
                    iconCls: 'fa fa-close',
                    handler: expressui.dialog.close
                }]
            });
        }
    }

    function roleDeleteAll() {
        $('#role').datagrid(expressui.grid.deleteRows, {
            url: Api.User.ROLE + '/delete_all',
            method: 'post',
            success: '删除成功',
            reload: {type: 'datagrid', selector: '#role'}
        });
    }

    function viewMenuDialog() {
        var one = $('#role').datagrid(expressui.grid.getCheckedOneShowAlert);
        if (!one) {
            return;
        }

        $('#viewMenuDialog').dialog(expressui.dialog.create, {
            title: '视图菜单管理',
            grid: {type: 'datagrid', selector: '#role'},
            href: Page.User.VIEW_MENU + '/page_all',
            width: 850,
            height: 450,
            buttons: [{
                text: '关闭',
                iconCls: 'fa fa-close',
                handler: expressui.dialog.close
            }]
        });
    }

    function roleAuthorityViewPageDialog() {
        var one = $('#role').datagrid(expressui.grid.getCheckedOneShowAlert);
        if (!one) {
            return;
        }

        $('#roleAuthorityViewPageDialog').dialog(expressui.dialog.create, {
            title: '视图页面权限管理',
            grid: {type: 'datagrid', selector: '#role'},
            href: Page.User.ROLE_AUTHORITY + '/view_page/page_all',
            width: 850,
            height: 450,
            buttons: [{
                text: '关闭',
                iconCls: 'fa fa-close',
                handler: expressui.dialog.close
            }]
        });
    }

    function roleAuthorityApiDialog() {
        var one = $('#role').datagrid(expressui.grid.getCheckedOneShowAlert);
        if (!one) {
            return;
        }

        $('#roleAuthorityApiDialog').dialog(expressui.dialog.create, {
            title: 'API 权限管理',
            grid: {type: 'datagrid', selector: '#role'},
            href: Page.User.ROLE_AUTHORITY + '/api/page_all',
            width: 850,
            height: 450,
            buttons: [{
                text: '关闭',
                iconCls: 'fa fa-close',
                handler: expressui.dialog.close
            }]
        });
    }

</script>
</body>
</html>